<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>元素的显示模式</title>
		<link href="css/xs.css" rel="stylesheet"/><!-- 外部样式 -->
	</head>
	<body>
		<!-- 元素的显示模式：
		1.块元素 block
		  比较霸道，单独占一行
		  默认宽度是父级元素宽度的100%
		  可以设置宽、高、对齐属性
		  块元素内可以包含行内元素或块元素
		2.行内元素 inline
		  一行显示多个 inline-block
		  默认宽度是内容本身的宽度
		  宽、高、对齐属性设置无效
		  行内元素里一般只包含文本或其他行内元素
		  链接标签中不要再包含链接标签
		3.行内块元素
		  一行显示多个
		  可以设置宽、高
		  默认宽度是内容本身的宽度
		  <input/>、<img/>、<td><td/>
		  元素显示模式转换：
		  display:block/inline/inline-block;
		  -->
		<div>
		<h4>redmi k70</h4>
		<p>性能旋风...</p>
		<span>2399元<del>2499元</del></span>
		
		</div>
		<span>用户名：</span>
		<input type="text"/>
		<span>密码：</span>
		<input type="password"/>
		<a href="#">baidu...</a>
	</body>
</html>
